<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>四川新华扬科技有限公司－订单管理</title>
<link rel="stylesheet" href="../../css/icon/icon_font/iconfont.css"/>
<link rel="stylesheet" type="text/css" href="../../plug/paging/css/zxf_page.css">
<link rel="stylesheet" type="text/css" href="../../plug/paging/css/yeIcon/iconfont.css">
<script src="../../js/common.js" type="application/javascript"></script>
<style type="text/css">
    body,html{
	    margin: 0;
	    padding: 0;
	    background: #fff;
	    width: 100%;
	    height: 100%;
    }
	.dian{
		border-radius: 5px;
		/*padding: 2px 5px;*/
		/*background: #307ECC;*/
		color: #4f81d4;
		display: inline-block;
		margin: 1px 3px;
		cursor: pointer;
	}
	.shipments{
		color: #1D901B;
	}
	.row{
		/*overflow: auto;*/
	}
	.indent{
		width:100%;
		height:100%;
	}
	/* 设置滚动条的样式 */
	::-webkit-scrollbar {
	    width:5px;
	}
	/* 滚动槽 */
	::-webkit-scrollbar-track {
	    border-radius:10px;
	}
	/* 滚动条滑块 */
	::-webkit-scrollbar-thumb {
	    border-radius:10px;
	    background:#fff;
	    -webkit-box-shadow:#fff;
	}
/*分页*/   
.tableBotts {width:100%;display:flex;position:relative;}
.commons {width:100px;line-height:40px;margin:0 15px;}
.zxf_pagediv {width:calc(100% - 100px)}
/*搜索*/
.searchAll {width:100%;min-width:700px;margin-top:20px;position:relative;display:flex;}
.search {width:50%;}
.searchR{width:50%;display: flex;position: relative;}
.kuan {width:200px;height:25px;border:1px solid #000;position: absolute;top: 0;right: 30px;}
.searchL {width:100%;height:100%;/*border:1px solid #000;*/}
.searchL input {border:none;height:100%;}
.souName {width:100%;height:100%;border:none;line-height: 25px;}
.selectTop{height: 25px;}
.searchRs{width: 25px;height: 25px;line-height: 25px;border-radius: 3px;color: #333333;border:1px solid #333333;text-align: center;position: absolute;top: 0;right: 1px}
#sample-table-14{text-align: center;}
/*上架选项*/
	  .indexCenterLT{
	    width:297px;
	    display: flex;
	    border: 1px solid #ddd;
	    border-radius: 3px;
	    margin-left: 20px;
	  }
	  .indexDiv1,.indexDiv2,.indexDiv3,.indexDiv4,.indexDiv5{
	    width:49px;
	    text-align: center;
	    line-height:30px;
	    border-right: 1px solid #ddd;
	    cursor: pointer;
	  }
	  .indexDiv,.indexDivs{
	    background:#4f81d4;
	    color: #fff;
	  }
	  .indexDiv6{
	    width:50px;
	    text-align: center;
	    line-height:30px;
	    border:none;
	    cursor: pointer;
	  }
	  .divindex:hover{
	    color: #4f81d4;
	    background:#d3e3f3;
	  }
	  .th{
	  	text-align: center;
	  }

</style>
</head>
<body>
	<div class="indent">
		<h3>订单管理</h3>
		<div class="indexCenterLT">
          <div class="divindexZ indexDiv1 indexDiv" did='100'>全部</div>
          <div class="divindexZ divindex indexDiv2" did='1'>待付款</div>
          <div class="divindexZ divindex indexDiv3" did='2'>待发货</div>
          <div class="divindexZ divindex indexDiv4" did='3'>待收货</div>
          <div class="divindexZ divindex indexDiv5" did='5'>已关闭</div>
          <div class="divindexZ divindex indexDiv6" did='6'>完成</div>

        </div>
		<div class="row">
			<div class="col-xs-12">
				<div class="table-responsive">
					<div class="searchAll">
			          <div class="search" style="line-height: 30px;">
			            <span>每页显示条数:</span>
			            <select class="selectTop" id="selectTop">
			              <option did='10'>10</option>
			              <option did='50'>50</option>
			              <option did='100'>100</option>
			            </select>
			          </div>
			          <div class="searchR">
				          <div class="kuan"><div class="searchL"><input type="text" name="" placeholder="输入订单号或商品名称搜索" class="souName" style="border:none"></div></div>
				          <div class="searchRs"><i class="iconfont icon-sousuo_o ca"></i></div>
			          </div>
			        </div>
					<table id="sample-table-14" class="table table-striped table-bordered table-hover">
						<thead>
							<tr>
								<th class="th">订单号</th>
								<th class="th">商品名称</th>
								<th class="th">商品总数</th>
								<th class="th">商品总价</th>
								<th class="th">订单状态</th>
								<th class="th">下单时间</th>
								<th class="th">操作</th>
							</tr>
						</thead>
						<tbody id="aa"></tbody>
					</table>
					<div class="tableBotts">
		              <div class="commons">共<text class="comNum"></text>页</div>
		              <div class="zxf_pagediv"></div>
		            </div>
				</div>
			</div>
		</div>
	</div>
	<div id="loads" style="display:block;position: fixed;top: 0;left: 0;background:rgba(0,0,0,0);width:100%;height: 100%;vertical-align: middle;z-index:99999;">
        <div style="width:100%;height:100%;display:flex;vertical-align: middle;">
            <div style="width:100px;height:140px;margin: auto;">
                <img src="../../imgs/load.gif" alt="" class="load1Img" style="width:100%;height:auto;border-radius:5px;background: rgba(0,0,0,0.5);" />
                <div class="loadFont" style='width:100%;text-align: center;display: block;color:#fff;font-size: 20px;'></div>
            </div>
        </div>
    </div>
</body>
<!-- <script src="../../js/common.js" type="application/javascript"></script> -->
<!-- <script src="../../js/jquery-1.8.2.min.js" type="application/javascript"></script> -->
<!-- <script src="../../js/index.js" type="application/javascript"></script> -->
<script type="text/javascript">
        window.jQuery || document.write("<script src='../../AceAdmin/assets/js/jquery-2.0.3.min.js'>"+"<"+"/script>");
    </script>
    <script type="text/javascript">
        if("ontouchend" in document) document.write("<script src='assets/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
    </script>
    <script src="../../plug/paging/js/zxf_page.js" type="text/javascript"></script>
    <script src="../../js/wenjian.js"></script>
	<script type="text/javascript">
		console.log(window.base.getLocalStorage('token'));
	    // var conten = $("body").height();
	    // console.log(conten)
	    // $(".row").css("height",conten+"px")
	    document.querySelector(".indent").style.height =  window.innerHeight +"px"
  	    document.querySelector(".indent").style.overflowY =  "auto"

		var msgg=[];
		var arr=[];
		var tableNum = 10;//每页显示条数
		var status = 100;//状态
		var names = ''//搜索内容
		var pageName = "manager"//当前查看方式
		//分页
		function fenye(num,types){
		    $(".comNum").html(num)
		    $(".zxf_pagediv").createPage({
		      pageNum: num,
		      current: 1,
		      backfun: function(e) {
		        var tr = document.querySelectorAll("#tr")
		        if(types == "indends"){
		        	indends(e.current,tableNum,names)
		        }
		        if(types == "manager"){
		        	manager(e.current,tableNum,status)
		        }
		        // strAll(staffAlls,e.current)
		        // console.log(e.current)
		        // console.log(e);//回调
		      }
		    });
		}
		//上架选项
		var divindexZ = document.querySelectorAll(".divindexZ")
		Array.from(divindexZ).forEach(function(dom,index){
		    dom.onclick = function(){
		      Array.from(divindexZ).forEach(function(dom1,index1){
		          dom1.classList.remove("indexDiv");
		          if(index != index1){
		            dom1.classList.add("divindex");
		          }else{
		            dom1.classList.remove("divindex");
		          }
		      })
		      status = dom.getAttribute("did")
		      dom.classList.add("indexDiv")
		      manager(1,tableNum,status)
		    }
		})
		 manager(1,10,100)
		function manager(page,size,status){
			$("#loads").css("display","block")
			$.ajax({
				url:"https://minitest.17jxyx.com/api/v1/order/manager",
				type:"post",
				data:{
					page:page,
					size:size,
					status:status
				},
				beforeSend: function (request) {
	                request.setRequestHeader('token', window.base.getLocalStorage('token'));
	            },
	            success:function(res){
	            	
	            	var tr = document.querySelectorAll(".trs")
				    Array.from(tr).forEach(function(c,d){
				      c.remove()
				    })
				    pageName = "manager"
	            	if(res.data){
	            		addTr( res.data)
	            	}
	            	//console.log(res)
	            	//console.log(res.data)

	            	if(page == 1){
	            		if(res.data.length > 0){
	            			fenye(res.last_page,"manager")
	            		}else{
	            			fenye(1,"manager")
	            		}
	            		
	            	}
	            	$("#loads").css("display","none")
	            },
	            error:function(res){
	            	$("#loads").css("display","none")
			        tokenDetection(res)
			    }
			})
		}
		//创建tr
		function addTr(arr){
			console.log(arr)
			if(arr.length > 0){
				arr.forEach(function(el,index){
					var status=''
					var operation=''
					if(el.status ==1 ){
						status ="待付款"
						operation = ""
					}
					if(el.status == 2){
						status = "待发货"
						operation ="<span class='dian shipments' did='"+el.id+"' onclick='addClassB("+el.id+")'>发货</span>"
					}
					if(el.status == 3){
						status = "待收货"
						operation = ""
					}
					if(el.status == 4){
						status = "库存不足"
						operation = ""
					}
					if(el.status == 5){
						status = "交易关闭"
						operation = ""
					}
					if(el.status == 6){
						status = "已收货"
						operation = ""
					}
					var tr = $("<tr class='trs' did='"+el.id+"'><td class='td1'>"+el.order_no+"</td><td class='td2'>"+el.snap_name+"</td><td class='td3'>"+el.total_count+"</td><td class='td4'>"+el.total_price+"</td><td class='td5'>"+status+"</td><td class='td6'>"+el.update_time+"</td><td class='td7'><span class='dian examine' did='"+el.id+"' onclick='lineItem("+el.id+")'>查看</span>"+operation+"</td></tr>")
					$(tr).appendTo("#aa")
				})
			}else{
				var tr = $("<tr class='trs'><td class='td1' colspan='7'>暂无数据</td></tr>")
					$(tr).appendTo("#aa")
			}
		}
		function lineItem(shopid){
			var obj={shopid:shopid}
			localStorage.setItem('lineItem',JSON.stringify(obj))
			window.parent.location.href=window.business.url + 'index.html#shopping/lineItem'
		}
		$("#selectTop").on("change",function(){
			selectClass()
		})
		// 分类下拉单选择
		function selectClass(){
		    var objS = document.getElementById("selectTop");
		    //  var grade = objS.options[objS.selectedIndex].did;
		    var val=objS.options[objS.selectedIndex].value;
		    var vals=objS.options[objS.selectedIndex].getAttribute("did");
		    tableNum = vals
		    if(pageName == "indends"){
				indends(1,vals,names)
		    }
		     if(pageName == "manager"){
		    	manager(1,vals,status)
		    }
		    
		    // var rasleng = Math.ceil(staffAlls.length / tableNum);
		    // console.log(rasleng);
		    // selnum(rasleng);
		    // fenye(rasleng)
		    // strAll(staffAlls,1)
		}
		//搜索
		function indends(page,tableNum,names){
			if($(".souName").val() == ''){
				alert("请输入订单号或商品名称查询")
			}else{
				$("#loads").css("display","block")
				pageName = "indends"
				$.ajax({
					url:"https://minitest.17jxyx.com/api/v1/order/search",
					type:"post",
					data:{
						page:page,
						size:tableNum,
						condition:names
					},
					beforeSend: function (request) {
		                request.setRequestHeader('token', window.base.getLocalStorage('token'));
		            },
		            success:function(res){
		            	var tr = document.querySelectorAll(".trs")
					    Array.from(tr).forEach(function(c,d){
					      c.remove()
					    })
		            	if(res.data){
		            		addTr( res.data)
		            	}

		            	if(page == 1){
		            		if(res.data.length > 0){
	            			fenye(res.last_page,"indends")
		            		}else{
		            			fenye(1,"indends")
		            		}
		            	}
		            	$("#loads").css("display","none")
		            },
		            error:function(res){
		            	$("#loads").css("display","none")
				      tokenDetection(res)
				    }
				})
			}
		}
		$(".searchRs").click(function(){
			names = $(".souName").val()
			indends(1,tableNum,names)
			
		})
	// }
 	//填写快递单
	function addClassB(wid){
	  	bootbox.dialog({
	        message: "<div class='row'><div class='department'>发货信息</div><div class='departmentAdd'><div class='nameClass'>快递公司：<input type='text' id='departmentName'></div><div class='nameClass'>快递单号：<input type='text' id='departmentNames'></div></div></div>",
	        // <div class='imgClass'>分类图片：<input type='fill' id='img'></div>
	        buttons:{
	          "确定":{
	            "className": "btn-sm btn-success",
	            "callback":function(){ 
	              var departmentName = $("#departmentName").val();
	              console.log(departmentName)
	              var departmentNames = $("#departmentNames").val();
	              console.log(departmentNames)
	              if(departmentName == ''){
	              	alert("请输入快递公司")
	              	return false;
	              }
	              if(departmentNames == ''){
	              	alert("请输入快递单号")
	              	return false;
	              }
	              console.log(wid,departmentName,departmentNames)
	              // var arr = []
	           
	              // arr["delivery_name"] = departmentName
	              // arr["waybill_id"] = departmentNames
	              // 
	              var obj = {
	              	delivery_name:departmentName,
	              	waybill_id:departmentNames
	              }
	              // console.log(arr)
	              $("#loads").css("display","block")
	              $.ajax({
				    url:"https://minitest.17jxyx.com/api/v1/order/delivery",
				    type:"PUT",
				    data:{
				    	id:wid,
				    	data:obj
				    },
				    tokenFlag:true,
				    beforeSend: function (request) {
				        request.setRequestHeader('token', window.base.getLocalStorage('token'));
				    },
				    success:function(res) {
				    	$("#loads").css("display","none")
				    	// console.log(res)
				    	console.log(tableNum)
				    	if(res.code == 201){
				    		alert("发货成功")
				    		manager(1,tableNum,100)
				    	}else{
				    		alert("发货失败")
				    	}
		                // if(res.code.toString().indexOf('2')==0){
		                //    $tr.find('.order-status-txt')
		                //        .removeClass('pay').addClass('done')
		                //        .text('已发货');
		                //        manager(1,tableNum,100)
		                //     $this.remove();
		                //     $p.text('操作成功');
		                // }else{
		                //     $p.text('操作失败');
		                // }
		                // $tips.show().delay(1500).hide(0);
		            },
		            error:function(res){
		            	$("#loads").css("display","none")
				        tokenDetection(res)
				    },
				    // success:function(res){
				    //    console.log(res)
				    // },
				    // error:function(res){
				    //   console.log(res)
				    // }
				  });

	     
	            }
	          },
	        }
	    })
	    $(".modal-content").css("width","300px")
	    $(".modal-content").css("margin","auto")
	    $(".modal-content").css("margin-top","20%")
	    $(".modal-footer").css("margin","0")
	    $(".modal-footer").css("border-top","1px solid #ccc")
	    $(".modal-body").css("padding","20px 20px 0 20px")
	    $(".nameClass").css("margin-top","5px")
	    $(".nameClass").css("margin-bottom","5px")

	}

	
</script>
</html>